@import "~@/common/stylus/variable.styl"

.md-body
  font-size: $fontsize-medium
  line-height: 1.6
  color: $color-dark-grey
  p
    margin: 1.2em 0
    .anchor
      display: inline-block
  h2
    margin-top: 1.2em
    margin-bottom: .8em
    font-size: 1.5em
    font-weight: 600
  h3
    margin: 1em 0 1em
    font-size: 1.25em
    font-weight: 600
  h4
    margin: 0.8em 0 0.8em
    font-size: 1.1em
    font-weight: 600
  blockquote
    padding: 0 1em
    color: $color-grey
    border-left: .25em solid $color-light-grey-s
  table
    // margin 0.8em 1em 0.8em 1em
    width: 100%
    color: $color-blue
    box-sizing: border-box
    table-layout: fixed
    th, td
      padding: 6px 13px
      border: 1px solid rgb(223, 226, 229)
      vertical-align: middle
      text-align: left
      word-wrap: break-word
      word-break: break-word
    th
      font-weight: 600
      background-color: $color-row-line
  ul, ol, li
    line-height: 20px
  li
    list-style: inherit
    margin: 1em 0
  ul
    padding-left: 20px
  h1, h2, h3, h4
    .anchor
      display: none
  h1:hover, h2:hover, h3:hover, h4:hover
    .anchor
      display: inline-block
      float: left
      margin-left: -20px
      position relative
      top: 6px
      padding-right: 4px
      line-height: 1
  img
    max-width: 100%
pre
  margin: .8em 0
  font-size: 12px
code
  font-family: monaco
  line-height: 1.4
  color: rgb(199, 37, 78)
  background: rgb(249, 242, 244)
  padding: 2px 4px
  box-sizing: border-box
  font-size: 0.93em
strong
  margin: 1em 0 1em
  font-weight: bold
a
  text-decoration: none
  color: rgb(0, 154, 97)
